<template>
    <j-modal
      :title="title"
      :width="600"
      :visible="visible"
      :maskClosable="false"
      :keyboard="false"
      :forceRender="true"
      @cancel="handleCancel"
      wrapClassName="ant-modal-cust-warp"
      style="top:5%;height: 100%;overflow-y: hidden">
      <template slot="footer">
        <a-button key="back" v-if="isReadOnly" @click="handleCancel">
          取消
        </a-button>
        <a-button key="back" @click="handleCancel">关闭</a-button>
      </template>
      <a-spin :spinning="confirmLoading">
      <a-form :form="form">
        <a-form-item  label="渠道来源" :labelCol="labelCol" :wrapperCol="wrapperCol">
           {{model.source}}
        </a-form-item>
        <a-form-item label="单号" :labelCol="labelCol" :wrapperCol="wrapperCol" >
            {{model.odd}}
        </a-form-item>
         <a-form-item label="日期" :labelCol="labelCol" :wrapperCol="wrapperCol" >
           {{model.createTimeStr}}
        </a-form-item>
        <a-form-item label="时间" :labelCol="labelCol" :wrapperCol="wrapperCol" >
           {{model.time}}
        </a-form-item>
        <a-form-item label="地址" :labelCol="labelCol" :wrapperCol="wrapperCol" >
           {{model.address}}
        </a-form-item>
        <a-form-item label="数量" :labelCol="labelCol" :wrapperCol="wrapperCol" >
           {{model.amount}}
        </a-form-item>
        <a-form-item label="客户姓名" :labelCol="labelCol" :wrapperCol="wrapperCol" >
           {{model.name}}
        </a-form-item>
        <a-form-item label="联系号码" :labelCol="labelCol" :wrapperCol="wrapperCol" >
           {{model.tel}}
        </a-form-item>
        <a-form-item label="身份证号" :labelCol="labelCol" :wrapperCol="wrapperCol" >
           {{model.idNumber}}
        </a-form-item>

        <a-form-item label="业务类型" :labelCol="labelCol" :wrapperCol="wrapperCol" >
           {{model.type}}
        </a-form-item>
        <a-form-item label="物品类别" :labelCol="labelCol" :wrapperCol="wrapperCol" >
           {{model.category}}
        </a-form-item>
        <a-form-item label="物品鉴定级别" :labelCol="labelCol" :wrapperCol="wrapperCol" >
           {{model.level}}
        </a-form-item>

        <a-form-item label="品牌,规格,重量" :labelCol="labelCol" :wrapperCol="wrapperCol" >
           {{model.brandWeight}}
        </a-form-item>
        <a-form-item label="寄存金额" :labelCol="labelCol" :wrapperCol="wrapperCol" >
           {{model.depositAmount}}
        </a-form-item>
        <a-form-item label="当日行情价" :labelCol="labelCol" :wrapperCol="wrapperCol" >
           {{model.daily}}
        </a-form-item>
        <a-form-item label="回收单价" :labelCol="labelCol" :wrapperCol="wrapperCol" >
           {{model.recyclePrice}}
        </a-form-item>
        <a-form-item label="回收总价" :labelCol="labelCol" :wrapperCol="wrapperCol" >
           {{model.recycleTotal}}
        </a-form-item>
        <a-form-item label="出货价" :labelCol="labelCol" :wrapperCol="wrapperCol" >
           {{model.deliveryPrice}}
        </a-form-item>
        <a-form-item label="利润" :labelCol="labelCol" :wrapperCol="wrapperCol" >
           {{model.profit}}
        </a-form-item>
        <a-form-item label="业务状态" :labelCol="labelCol" :wrapperCol="wrapperCol" >
           {{model.state}}
        </a-form-item>
        <a-form-item label="业务员" :labelCol="labelCol" :wrapperCol="wrapperCol" >
           {{model.ope}}
        </a-form-item>
        <a-form-item label="行情收益反馈" :labelCol="labelCol" :wrapperCol="wrapperCol" >
           {{model.feedback}}
        </a-form-item>
        <a-form-item label="寄存时长服务率" :labelCol="labelCol" :wrapperCol="wrapperCol" >
           {{model.rate}}
        </a-form-item>
        <a-form-item label="寄存到期时间记录" :labelCol="labelCol" :wrapperCol="wrapperCol" >
           {{model.endTime}}
        </a-form-item>
        <a-form-item label="到期提醒" :labelCol="labelCol" :wrapperCol="wrapperCol" >
           {{model.reminder}}
        </a-form-item>
        <!-- <a-form-item label="" :labelCol="labelCol" :wrapperCol="wrapperCol" >
           {{model.}}
        </a-form-item> -->
        <a-form-item label="资金来源" :labelCol="labelCol" :wrapperCol="wrapperCol" >
           {{model.fundSource}}
        </a-form-item>
        <a-form-item label="其他备注" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-textarea :rows="4" placeholder="请输入其他备注" v-model="model.remark" :readOnly="true"/>
          <!-- <a-textarea :rows="4" placeholder="请输入信息描述" v-decorator="[ model.other_moment ]"  :readOnly="true"/> -->
        </a-form-item>
        <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="业务图片">
          <img style="width:200px;height: 150px;" :src="model.fileName">
        </a-form-item>
        <!-- <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="业务图片">
          <j-image-upload v-model="fileList" bizPath="produce" text="上传" isMultiple disabled></j-image-upload>
        </a-form-item> -->
      </a-form>
    </a-spin>
    </j-modal>
</template>
<script>
  import pick from 'lodash.pick'
  import Vue from 'vue'
  import { ACCESS_TOKEN } from "@/store/mutation-types"
  import JUpload from '@/components/jeecg/JUpload'
  import JImageUpload from '@/components/jeecg/JImageUpload'
  export default {
    name: 'EngineerProduceDetail',
    components: {
      JImageUpload,
      JUpload
    },
    data () {
      return {
        title:"详情",
        visible: false,
        isReadOnly: false,
        modalWidth:600,
        drawerWidth:600,
        model: {},
        fileList: [],
        labelCol: {
          xs: { span: 24 },
          sm: { span: 6 },
        },
        wrapperCol: {
          xs: { span: 24 },
          sm: { span: 16 },
        },
        form: this.$form.createForm(this),
        uploadLoading:false,
        confirmLoading: false,
        headers:{},
        dataSource: [],
      }
    },
    created () {
      const token = Vue.ls.get(ACCESS_TOKEN);
      this.headers = {"X-Access-Token":token}
    },
    methods: {
      show(record) {
        //附件下载
        // this.fileList = record.fileName
        if(JSON.stringify(record) === '{}') {
          this.fileList = []
        } else {
          setTimeout(() => {
            this.fileList = record.fileName
          }, 5)
        }
        this.visible = true;
        this.$nextTick(() => {
          this.model = Object.assign({}, record);
          this.form.setFieldsValue(pick(this.model,'source','odd','date','time','name','tel','idNumber','address','type','category','level','amount','brandWeight','depositAmount','recyclePrice','recycleTotal','deliveryPrice','feedback','rate','nameB','endTime','reminder','remark','fundSource','fileName'))
        });
      },

      handleCancel() {
        this.close()
      },
      close() {
        this.$emit('close');
        this.visible = false;
      }
    }
  }
</script>

<style lang="less" scoped>
@import "chart";
</style>